<template>
  <div class="flex flex-1 flex-col justify-center px-6 py-5 lg:px-8">
    <div class="sm:mx-auto sm:w-full sm:max-w-sm flex flex-col justify-center items-center">
      <img src="../assets/logo.png" class="w-32">
      <h2 class="text-center text-2xl font-bold leading-9 tracking-tight">找回密码</h2>
    </div>
    <div class="mt-10 sm:mx-auto sm:w-full sm:max-w-sm">
      <div>
        <label for="email" class="block text-sm font-medium leading-6 text-left">密码</label>
        <div class="mt-2">
          <input id="email" name="email" type="password" autocomplete="email" required=""
                 v-model="pwd_1"
                 class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"/>
        </div>

        <div class="flex items-center justify-between mt-5">
          <label for="password" class="block text-sm font-medium leading-6">确定密码</label>
        </div>
        <div class="mt-2 flex flex-row gap-2">
          <input v-model="pwd_2"
                 id="password" name="password" type="password"
                 autocomplete="current-password"
                 class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"/>
        </div>
        <button type="submit"
                @click="editPassword()"
                class="btn btn-primary w-full rounded-2xl mt-5">
          完成
        </button>
        <button @click="router.push('/login')"
                type="submit"
                class="btn btn-ghost w-full rounded-2xl mt-5">
          登录
        </button>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import {onBeforeMount, reactive, ref} from "vue";
import router from "../plugins/router.ts";
import {hook_editPasswordByEmail, hook_getUser, hook_updateUser} from "../hook/UserHook.ts";
import {useToast} from "vue-toastification";
import {useAuthStore} from "../plugins/pinia.ts";

let pwd_1 = ref();
let pwd_2 = ref();

onBeforeMount(() => {
  if (useAuthStore().isEditPassword == false) {
    router.push("/home")
  }
})
let updateFlag = ref(false)

async function editPassword() {
  if (pwd_1.value == pwd_2.value) {
    let flag = false
    try {
      console.log(useAuthStore().editEmail,pwd_1.value)
      let data = await hook_editPasswordByEmail(useAuthStore().editEmail,pwd_1.value);
      flag = data?.['flag']
      console.log(data)
    } catch (e) {
      flag = false
    }
    if(flag == true){
      await router.push("/login")
      useToast().success("密码修改成功")
    }else{
      useToast().error("密码修改失败")
    }
  }
}



</script>

<style scoped>


</style>
